<template>
  <div class="connect">
    <div class="top_connect">
      <div class="top_connect_left">
          <div class="top_connect_left_top">
            <span class="off_name">{{userInfo.userName}}</span>
            <el-descriptions style="margin-top: 40px;" title=" " :column="1">
                <el-descriptions-item :label="$t('Order_module.Phone_number')">{{userInfo.phone}}</el-descriptions-item>
                <el-descriptions-item :label="$t('public.status')">
                  <!-- 1已激活 0 未激活 -->
                  <el-tag size="small">{{userInfo.status==1?$t('public.Active'):$t('public.not_active')}}</el-tag>
                </el-descriptions-item>
                <el-descriptions-item label="email">
                  <!-- 1已激活 0 未激活 -->
                 {{userInfo.email?userInfo.email:'-'}}
                </el-descriptions-item>
                  <el-descriptions-item :label="$t('UserInfo.Role_Permission')">{{lang=='ko'?userInfo.korDataPerms:userInfo.dataPerms}}</el-descriptions-item>
              </el-descriptions>
          </div>
      </div>
      <div class="top_connect_right">
          <div class="top_connect_right_top">
              <div class="top_connect_right_top_item">
                <span>{{$t('index.Settlement_currency_balance')}}</span>
                <div class="number_size">
                  <count-to
                  :decimals='2'
                    :start-val="0"
                    :end-val="(userInfo.rechargeType==1 || userInfo.id==1) ? userInfo.balance:0"
                    :duration="1000"
                  />
                </div>
                <div class="uni-uni-flex-between">
                  {{$t('index.unit')}}:KRW
                  <!-- <el-button @click="pay" v-if="(userInfo.rechargeType==1 || userInfo.id==1)"  style="height: 25px;padding: 0 10px;" type="primary">
                    {{$t('index.Recharge_Now')}}
                  </el-button> -->
                </div>

              </div>
              <div class="top_connect_right_top_item">
                  <span>{{$t('index.Available_limit')}}</span>
                  <div class="number_size">
                    <count-to
                    :decimals='2'
                      :start-val="0"
                      :end-val=" (userInfo.rechargeType==1 || userInfo.id==1)?userInfo.residueBalance:0"
                      :duration="1000"
                    />
                  </div>
                  <div>
                    {{$t('index.unit')}}:KRW
                  </div>
              </div>
          </div>
         <div class="top_connect_right_top">
             <div class="top_connect_right_top_item">
                <span>{{$t('index.Remaining_single_quantity')}}</span>
                <div class="number_size">
                  <count-to
                    :start-val="0"
                    :end-val="(userInfo.rechargeType==0 || userInfo.id==1)?userInfo.oddNumbers:0"
                    :duration="1000"
                  />
                </div>
                <div>

                </div>
             </div>
             <div class="top_connect_right_top_item">
                <span>{{$t('index.Used_quantity')}}</span>
                <div class="number_size">
                  <count-to
                    :start-val="0"
                    :end-val="(userInfo.rechargeType==0 || userInfo.id==1)?userInfo.residueOddNumbers:0"
                    :duration="1000"
                  />
                </div>
                <div>

                </div>
             </div>
         </div>

      </div>


    </div>
    <div class="button_connect">
        <!-- 快捷功能 -->
        <div class="button_connect_left">
          <div class="button_connect_left_title">
            {{$t('index.searchOrder')}}
          </div>
          <div class="btn_2_box">
            <div v-for="(item,index) in MenuList" :key="index" @click="navto(item.path)"  class="btn_2" type="primary">
              {{$t('route.'+item.meta.title) }}
            </div>
          </div>
        </div>
        <div class="button_connect_left">
          <div class="button_connect_left_title">
            {{$t('index.searchOrder')}}
            <el-button type="primary" @click="select_nav(textarea)">{{$t('public.query')}}</el-button>
          </div>
          <div class="kuaiJie">
            <el-input
              type="textarea"
              :rows="10"
              :placeholder="$t('index.placeholder_index')"
              @keyup.enter.native="select_nav(textarea)"
              v-model="textarea">
            </el-input>
          </div>

        </div>
    </div>
  </div>
</template>

<script>
  import {
    menu_shortcut,
    getAccessToken,
    getBusinessAccessToken,
    getServiceAccessToken
  } from '@/api/wqzApi'
  import store from '@/store'
  import axios from 'axios'
  import CountTo from 'vue-count-to'

  export default {
    components: {
        CountTo
      },
    data() {
      return {
        lang:store.getters.language,
        userInfo:store.getters.userInfo,
        MenuList:[] , //快捷菜单列表
        textarea:'',
        value1:0,
        value2:0,
        value3:0,
        value4:0,
        jD_code:{}
      }
    },

    created() {
      console.log(store.getters , '首页')
      var params = this.$getUrlParams()
      console.log(params)
      if(params.code){
        var formdata = new FormData()
        params.code  =params.code.split('#/')[0]

        formdata.append('code' , params.code)
        if(params.state == 1){
          // 1服务商
          getServiceAccessToken(formdata).then(res=>{

            var path = 'http://jdldcs.com/#/JDempower/AJD/JDempower/empower'
            console.log(path , '服务商平台返回信息')
            window.location.href = path
          })
        }
        if(params.type == 2){
          // 2物流开放平台
          getAccessToken(formdata).then(res=>{
            console.log(res , '物流开放平台返回信息')
            var path = 'http://jdldcs.com/#/JDempower/AJD/JDempower/empower'
            window.location.href = path
          })
        }
        if(params.state == 3){
          // 商家
          var data = {
            code: params.code,
            id: localStorage.getItem('shop_id'),
          }
          getBusinessAccessToken(data).then(res=>{
            var Host_url = window.location.host
            var path = `http://${Host_url}/#/JDempower/AJD/JDempower/empower`//'http://jdldcs.com/#/JDempower/AJD/JDempower/empower'
            window.location.href = path
          })
        }
      }

    },
    mounted() {
      this.getmenu_shortcut()
      var obj = this.$getUrlParams()
      if(obj.code){
        var arr = obj.code.split('#/')
        obj.code = arr[0]
        this.jD_code  = obj
      }
    },
    destroyed() {

    },
    methods: {
      pay(){
        var path = '/Cost_module/AJD/Cost_module/Electronic_ticket_management'
        this.$router.push({ path:path})

      },
      select_nav(val){
        var path = '/Order_module/AJD/Order_module/Order_Status_Management?ids='+val
        this.$router.push({ path:path})
      },
      getcode(){
        var appKye = '5C013E3DE842357BAFA19D5B767916FB'
        var redirect_url = "http://localhost:9527/"
        var url =`
          https://open-oauth.jd.com/oauth2/to_login?app_key=${appKye}&response_type=code&redirect_uri=${redirect_url}&state=1231132132132132&scope=snsapi_base
        `
        window.location.href = url
      },
      getmenu_shortcut(){
        menu_shortcut({}).then(res=>{
          this.MenuList = res.menuList
        })
      },
    navto(url){
      this.$router.push({ path:url})
    },
    navTo(){
        this.$router.push({ path:'/Waybill_module/Waybill_printing'})
      }


    }
  }
</script>

<style scoped>
  @import url(index.css);
</style>
